<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    //     callback （执行数组中每个值的函数，包含四个参数）
    //  1、previousValue （上一次调用回调返回的值，或者是提供的初始值（initialValue））
    //  2、currentValue （数组中当前被处理的元素）
    //  3、index （当前元素在数组中的索引）
    //  4、array （调用 reduce 的数组）
    // initialValue （作为第一次调用 callback 的第一个参数。）
    // 简单用法，求和
    var arr = [1, 2, 3, 4]
    var result = arr.reduce(function (sum, value, index) {
      return sum + value
    }, 0)
    console.log(result);

    // 简单用法，求乘积
    var result2 = arr.reduce((sum, value, index) => {
      return sum * value
    })
    console.log(result2);

    // 高级用法 计算数组中每个元素出现的次数
    let names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
    let nameNum = names.reduce((res, cur) => {
      if (cur in res) {
        res[cur]++
      } else {
        res[cur] = 1
      }
      return res
    }, {})
    console.log(nameNum)

    // 高级用法，数组简单去重

    let arr2 = [1, 2, 3, 4, 4, 1]
    let newArr = arr2.reduce((res, val) => {
      if (!res.includes(val)) {
        res.push(val)
      }
      return res
    }, [])
    console.log(newArr);
  </script>
</body>

</html>